<template>
  <div style="height: 100%">
      <el-header style="border-bottom:0.5px solid #DCDCDC;height: 30px">
        <div>
          <el-button v-for="button in buttons" :key="button.text" :type="button.type" link @click="OnMenuClick(button.comp)">
            {{ button.text }}
          </el-button>
        </div>
      </el-header>
      <el-main style="height: 97%;">
        <component :is=comp></component>
      </el-main>
  </div>
</template>

<script>
  import HomeView from "@/components/HomeView.vue";
  import AnnoView from "@/components/AnnoView.vue";
  export default {
    components:{
      HomeView,
    },
    name: 'MainView',
    data(){
      return{
        comp:HomeView,
        buttons:[
          {"id":"01","text":"主页","type":"","comp":HomeView},
          {"id":"02","text":"图像标注","type":"","comp":AnnoView},
        ]
      }
    },
    methods:{
      OnMenuClick(comp){
        this.comp =comp
      }
    }
  }
</script>
